<template>
    <div class="publicpageview">
        <div class="publicformview">
            <el-form :inline="true" :model="listQuery" size="mini" ref="searchForm" label-width="100px">
                <el-row :gutter="20">
                    <el-col :span="4">
                        <el-form-item label="类型：" prop="status">
                            <el-select v-model="listQuery.status">
                                <el-option label="发布" value="1" key="1"></el-option>
                                <el-option label="不发布" value="0" key="0"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>

                    <el-col :span="4">
                        <el-form-item label="管理单位：" prop="status">
                            <el-select v-model="listQuery.status">
                                <el-option label="发布" value="1" key="1"></el-option>
                                <el-option label="不发布" value="0" key="0"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>

                    <el-col :span="4">
                        <el-form-item label="管理部：" prop="status">
                            <el-select v-model="listQuery.status">
                                <el-option label="发布" value="1" key="1"></el-option>
                                <el-option label="不发布" value="0" key="0"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>


                    <el-col :span="4">
                        <el-form-item label="年份：" prop="status">
                            <el-date-picker v-model="listQuery.year" type="year" placeholder="年">
                            </el-date-picker>
                        </el-form-item>
                    </el-col>

                    <el-col :span="4">
                        <el-form-item label="月份：" prop="status">
                            <el-date-picker v-model="listQuery.year" type="month" placeholder="年/月">
                            </el-date-picker>
                        </el-form-item>
                    </el-col>

                    <el-col :span="4">
                        <el-form-item label="管片代码：" prop="keyword">
                            <el-input v-model="listQuery.keyword"></el-input>
                        </el-form-item>
                    </el-col>

                    <el-col :span="4">
                        <el-form-item label="所编号：" prop="keyword">
                            <el-input v-model="listQuery.keyword"></el-input>
                        </el-form-item>
                    </el-col>

                    <el-col :span="4">
                        <el-form-item label="所地址：" prop="keyword">
                            <el-input v-model="listQuery.keyword"></el-input>
                        </el-form-item>
                    </el-col>


                    <el-col :span="4">
                        <el-form-item label="住非：" prop="status">
                            <el-select v-model="listQuery.status">
                                <el-option label="发布" value="1" key="1"></el-option>
                                <el-option label="不发布" value="0" key="0"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>

                    <el-col :span="4">
                        <el-form-item label="工程类别：" prop="status">
                            <el-select v-model="listQuery.status">
                                <el-option label="发布" value="1" key="1"></el-option>
                                <el-option label="不发布" value="0" key="0"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>

                    <el-col :span="4">
                        <el-form-item label="修缮项目：" prop="status">
                            <el-select v-model="listQuery.status">
                                <el-option label="发布" value="1" key="1"></el-option>
                                <el-option label="不发布" value="0" key="0"></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>

                    <el-col :span="4">
                        <el-form-item label="竣工日期：" prop="status">
                            <el-date-picker v-model="listQuery.year" type="date" placeholder="年/月/日">
                            </el-date-picker>
                        </el-form-item>
                    </el-col>

                    <el-col :span="4">
                        <el-form-item label="开工面积：" prop="keyword">
                            <el-input v-model="listQuery.keyword"></el-input>
                        </el-form-item>
                    </el-col>

                    <el-col :span="4">
                        <el-form-item label="开工工作量：" prop="keyword">
                            <el-input v-model="listQuery.keyword"></el-input>
                        </el-form-item>
                    </el-col>




                    <el-col :span="4">
                        <div style="padding-left: 90px;">
                            <el-button size="mini" type="primary">查询</el-button>
                            <el-button size="mini" @click="resetForm('searchForm')">重置</el-button>
                        </div>
                    </el-col>
                </el-row>
            </el-form>
        </div>

        <div class="publitableview">
            <el-button type="primary" size="mini" @click="handleAddUser('add')">导出</el-button>

            <div
                style="width: 100%; text-align: center; font-weight: bold;font-size: 16px; color: #333333;margin: 20px 0;">
                碎修考核情况统计表（公产）
            </div>
            <el-table :data="list" border fit highlight-current-row size="mini">

                <el-table-column>
                    <template slot="header" slot-scope="scope">
                        <span>单位： </span>
                        <span style="margin-left: 500px;">时间： </span>
                    </template>
                    <el-table-column label="单位" align="center">

                    </el-table-column>
                    <el-table-column label="本月任务单合" align="center">

                    </el-table-column>

                    <el-table-column label="任务单分项目" align="center">
                        <el-table-column label="木工" align="center">

                        </el-table-column>
                        <el-table-column label="瓦工" align="center">

                        </el-table-column>
                        <el-table-column label="水暖" align="center">

                        </el-table-column>
                        <el-table-column label="电工" align="center">

                        </el-table-column>
                        <el-table-column label="其它" align="center">

                        </el-table-column>
                    </el-table-column>

                    <el-table-column label="考核员考核情况" align="center">
                        <el-table-column label="单数" align="center">

                        </el-table-column>
                        <el-table-column label="考核面" align="center">
                        </el-table-column>
                    </el-table-column>

                    <el-table-column label="工长考核情况" align="center">
                        <el-table-column label="单数" align="center">
                        </el-table-column>
                        <el-table-column label="考核面" align="center">
                        </el-table-column>
                    </el-table-column>

                    <el-table-column label="站长考核情况" align="center">
                        <el-table-column label="单数" align="center">
                        </el-table-column>
                        <el-table-column label="考核面" align="center">
                        </el-table-column>
                    </el-table-column>
                    <el-table-column label="住户表扬情况" align="center">
                        <el-table-column label="单数" align="center">
                        </el-table-column>
                        <el-table-column label="百分比" align="center">
                        </el-table-column>
                    </el-table-column>

                    <el-table-column label="住户满意情况" align="center">
                        <el-table-column label="单数" align="center">
                        </el-table-column>
                        <el-table-column label="百分比" align="center">
                        </el-table-column>
                    </el-table-column>


                    <el-table-column label="收回任务单情况" align="center">
                        <el-table-column label="单数" align="center">
                        </el-table-column>
                        <el-table-column label="百分比" align="center">
                        </el-table-column>
                    </el-table-column>

                    <el-table-column label="未收回任务单情况" align="center">
                        <el-table-column label="单数" align="center">
                        </el-table-column>
                        <el-table-column label="百分比" align="center">
                        </el-table-column>
                    </el-table-column>
                </el-table-column>
            </el-table>

            <div class="publicpaginationview">
                <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
                    :current-page="listQuery.pageNum" background :page-sizes="[10, 20, 50, 100]"
                    :page-size="listQuery.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"
                    small></el-pagination>
            </div>
        </div>





    </div>
</template>

<script>
export default {
    name: "AccommodationManagementIndex",

    data() {
        return {
            listQuery: {
                pageNum: 1,
                pageSize: 20,
                keyword: "",

                status: "1",
            },
            total: 0,

            list: [
                {
                    userId: 0,
                    userName: "吴晓华",
                    userStatus: "0",

                    remarks: "此角色为测试角色",

                },
            ],
        };
    },

    computed: {

    },

    mounted() {
        this.total = this.list.length;
    },

    methods: {
        handleSizeChange(val) {
            this.listQuery.pageNum = 1;
            this.listQuery.pageSize = val;
            this.getList();
        },
        handleCurrentChange(val) {
            this.listQuery.pageNum = val;
            this.getList();
        },
        getList() {

            newsPage(this.listQuery).then((response) => {
                this.total = response.data.total;
                this.list = response.data.list;

            });
        },

        resetForm(val) {

            this.$refs[val].resetFields();
        },

        handleAddUser(type) {

        },


    },
};
</script>

<style scoped>
.el-date-editor.el-input {
    width: 100%;
    cursor: pointer;
}

::v-deep .el-upload-list__item.is-success .el-upload-list__item-status-label {
    display: none !important;
}

::v-deep .el-upload--picture-card {
    width: 80px !important;
    height: 80px !important;
    line-height: 80px !important;
}

::v-deep .el-upload--picture-card:hover,
.el-upload:focus {
    border-color: #008C93;
    color: #008C93;
}

::v-deep .el-upload-list--picture-card .el-upload-list__item {
    width: 80px !important;
    height: 80px !important;
    line-height: 80px !important;
}
</style>